<template>
  <div v-if='$route.meta.useFrame != undefined && $route.meta.useFrame == true' >
    <RouterView></RouterView>
  </div>
  <div v-if='$route.meta.useFrame == undefined || $route.meta.useFrame == false'>
    <el-container>
      <el-header class="Header">
        <el-row class="row-bg" justify="space-between">
          <el-col :span="6">
            <img src="./assets/logo.jpg" alt="图标" width="200px" height="40px">
          </el-col>
          <el-col :span="6" style="line-height: 40px;">
            后台管理系统
          </el-col>
          <el-col :span="6">
            <Dropdowns />
          </el-col>
        </el-row>

      </el-header>
      <el-container>
        <el-aside width="200px" class="Aside">
          <Menu></Menu>
        </el-aside>
        <el-main class="main">
          <RouterView />
        </el-main>
      </el-container>
    </el-container>
  </div>


</template>
<script setup lang="ts">
import Dropdowns from './components/layout/Dropdowns.vue'
import Menu from './components/layout/Menu.vue'
</script>
<style scoped>
.Header{
  padding: 0px;
  background-color: #c6e2ff;
  height: 40px;
}
.Aside{
  background-color: #f0f9eb;
}
.conent{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.example-showcase .el-dropdown-link {
  cursor: pointer;
  color: var(--el-color-primary);
  display: flex;
  align-items: center;
}
</style>
